<!doctype html>
<html lang="en">
	<head>
    	<meta charset="utf-8">
		<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
		<script type="text/javascript" src="../jquery.jcryption.3.1.0.js"></script>
		<script type="text/javascript">

			$(function() {
				var password = $.jCryption.encrypt("XXXX", "turbo");

				$.jCryption.authenticate(password, "jcryption.php?getPublicKey=true", "jcryption.php?handshake=true", function(AESKey) {
					$("#text,#encrypt,#decrypt,#serverChallenge").attr("disabled",false);
					$("#status").html('<span style="font-size: 16px;">Let\'s Rock!</span>');
				}, function() {
					// Authentication failed
				});

				$("#encrypt").click(function() {
					var encryptedString = $.jCryption.encrypt($("#text").val(), password);
					$("#log").prepend("\n").prepend("----------");
					$("#log").prepend("\n").prepend("String: " + $("#text").val());
					$("#log").prepend("\n").prepend("Encrypted: " + encryptedString);
					$("#text").val(encryptedString);
					$.ajax({
						url: "jcryption.php",
						dataType: "json",
						type: "POST",
						data: {
							jCryption: encryptedString
						},
						success: function(response) {
							$("#log").prepend("\n").prepend("Server decrypted: " + response.data);
						}
					});
				});

				$("#serverChallenge").click(function() {
					$.ajax({
						url: "jcryption.php?decrypttest=true",
						dataType: "json",
						type: "POST",
						success: function(response) {
							$("#log").prepend("\n").prepend("----------");
							$("#log").prepend("\n").prepend("Server original: " + response.unencrypted);
							$("#log").prepend("\n").prepend("Server sent: " + response.encrypted);
							var decryptedString = $.jCryption.decrypt(response.encrypted, password);
							$("#log").prepend("\n").prepend("Decrypted: " + decryptedString);
						}
					});
				});

				$("#decrypt").click(function() {
					var decryptedString = $.jCryption.decrypt($("#text").val(), password);
					$("#log").prepend("\n").prepend("----------");
					$("#log").prepend("\n").prepend("Decrypted: " + decryptedString);
					$("#text").val(decryptedString);
				});

			});
		</script>
	</head>

	<body>
		<p id="status"><span style="font-size: 16px;">Encrypting channel ...</span></p>
		String: <input type="text" id="text" disabled="disabled" /> <button id="encrypt" disabled="disabled">encrypt</button><button id="decrypt" disabled="disabled">decrypt</button><button id="serverChallenge" disabled="disabled">get encrypted time from server</button><br/>
		Log:<br/>
		<textarea cols="60" rows="25" id="log"></textarea>
	</body>
</html>
